import React, { Component } from 'react'
import TwsLayout from './tws-layout/index'
import { IntlProvider } from 'react-intl'
import locales from '../locales'
import '../less/index.less'
import {
  HashRouter as Router,
  Route
} from 'react-router-dom'
import {getLangFromLocalStorage} from '../constant/lang-util'
import { LocaleProvider } from 'antd'
import { connect } from 'react-redux'
import DiffBody from './diff/diff-program-body'
import DiffProgramHistoryBody from './diff/program-history-diff/diff-program-history-body'
import DiffTaskHistoryBody from './diff/task-history-diff/diff-task-history-body'

class App extends Component {
  render () {
    const lang = this.props.lang || getLangFromLocalStorage()
    const langData = locales[lang]
    return (<IntlProvider locale={langData.intlLocale} messages={langData.intlMessage}>
      <LocaleProvider locale={langData.locale}>
        <Router>
          <TwsLayout lang={lang}>
            <Route exact path='/programs/:programId' component={DiffBody} />
            <Route exact path='/programs/:programId/history' component={DiffProgramHistoryBody} />
            <Route exact path='/tasks/:taskId/history' component={DiffTaskHistoryBody} />
          </TwsLayout>
        </Router>
      </LocaleProvider>
    </IntlProvider>)
  }
}

const mapStateToProps = ({lang}) => ({lang})

export default connect(mapStateToProps)(App)
